<template>
    <view class="main">
        <image class="custom_img" :src="Listitem.card_picture"></image>
        <view class="custom_text">
            <view class="previewtext_tit">{{ Listitem.card_name}}</view>
            <view class="previewtext_sub_tit">{{  Listitem.card_describe }}</view>
        </view>
    </view>
  </template>
  
  <script>
    export default {
      name: 'Card',
      data() {
        return {
          // 组件的数据
        };
      },
      props: {
        // 声明需要接收的参数
        Listitem: Object,
	},
	onload() {

	},
	created() {
		// console.log('e',this.Listitem)
	},
      methods: {
        // 组件的方法
      }
    };
  </script>
    
  <style scoped lang="scss">
    /* 组件的样式 */
    .main{
        width: 720rpx;
        height: 210rpx;
        margin: 0 auto;
        border-radius: 12rpx;
        background: rgba(255, 255, 255, 1);
        box-shadow: 0px 2px 4px  rgba(0, 0, 0, 0.25);
        display: flex;
			.custom_img{
				width: 218rpx;
				height: 208rpx;
				border-radius: 12rpx;
				// border: 1px dashed rgba(10, 54, 250, 1);
			}
			.custom_text{
				width: 490rpx;
				height: 210rpx;
				// border: 1px solid black;
				.previewtext_tit{
					width: 460rpx;
					height: 90rpx;
					font-size: 36rpx;
					font-weight: 400;
					line-height: 45rpx;
					margin: 40rpx 0 0 26rpx;
					// border: 1px solid black;
					color: rgb(0, 0, 0);
					white-space: nowrap; /* 不换行 */
					overflow: hidden; /* 超出部分隐藏 */
					text-overflow: ellipsis; /* 使用省略号表示被隐藏的部分 */
				}
				.previewtext_sub_tit{
					width: 460rpx;
					height: 80rpx;
					margin:  0 0 0 26rpx;
					font-size: 28rpx;
					// border: 1px solid black;
					font-weight: 400;
					line-height: 40rpx;
					color: rgba(128, 128, 128, 1);
					display: -webkit-box; /* 必须指定display属性 */
					overflow: hidden; /* 必须指定overflow属性 */
					text-overflow: ellipsis; /* 显示省略号 */
					max-height: 80rpx; /* 最大高度（根据需求调整）*/
					-webkit-line-clamp: 2; /* 最多显示的行数 */
					-webkit-box-orient: vertical; /* 必须指定box-orient属性 */
				}	
			}
    }
  </style>